<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>defineProperty</title>
  </head>
  <body>
    <script>
      const info = {
        password: 123456,
      }

      const data = {
        _username: '我是data中的user',
        _password: '我是data中的password',
      }

      // //Object.defineProperty(要定义属性的对象, 属性键, 要定义或修改的属性的描述符)
      // Object.defineProperty(info,'username',{
      //   value:'123', //包含这个属性的数据值。默认值为undefined。
      //   writable:false, //表示能否修改属性的值。默认值为false。
      //   enumerable:false, //表示能否通过遍历访问属性，默认值为false
      //   configurable:false //表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或者能否把属性修改为访问器属性，默认值为false
      // })
      
      // // Object.defineProperty(info,'username',{
      // //   value:'123', //包含这个属性的数据值。默认值为undefined。
      // //   writable:true, //表示能否修改属性的值。默认值为false。
      // //   enumerable:true, //表示能否通过遍历访问属性，默认值为false
      // //   configurable:true //表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或者能否把属性修改为访问器属性，默认值为false
      // // })

      // console.log(info.username);

      // info.username = '321'

      // console.log(info.username);

      // for(let key in info) {
      //   console.log(info[key]);
      // }

      // delete info.username

      // console.log(info);




        // Object.defineProperty(info, 'username', {
        //   // 获取属性的时候会调用get函数
        //   get() {
        //     console.log('我被调用了');

        //     return data._username
        //   },
        //   // 设置属性的时候会调用set函数
        //   set(value) {
        //     // console.log('我是set函数，我被调用了');

        //     // console.log(value);

        //     data._username = value
            
        //   }
        // })

        // // console.log(info.username);

        // info.username = '321'

        // console.log(info.username);

        // console.log(info);

      Object.defineProperties(info, {
        username: {
          get() {
            //   return this.username
            return data._username
          },

          set(value) {
            //   this.username = value
            data._username = value
          },
        },
        password: {
          get() {
            //   return this._password
            return data._password
          },

          set(value) {
            //   this._password = value
            data._password = value
          },
        },
      })

      console.log(info);

      console.log(info.username)
      console.log(info.password)
      info.username = '我修改了一下data中的username'
      info.password = '我修改了一下data中的password'
      // console.log(info.username)
      // console.log(info.password)
    </script>
  </body>
</html>
